<template>
	<view class="productImg">
		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" class="lunbo">
			<swiper-item v-for="(item,index) in imgUrl">
				<view class="swiper-item">
					<image :src="item" mode="scaleToFill"></image>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default{
		props:{
			imgUrl:{
				type:Array,
				default:['https://tse2-mm.cn.bing.net/th/id/OIP-C.EmcIuqtQtavOIZ6-cQxDYAHaFk?w=217&h=180&c=7&r=0&o=5&pid=1.7','https://tse2-mm.cn.bing.net/th/id/OIP-C.EmcIuqtQtavOIZ6-cQxDYAHaFk?w=217&h=180&c=7&r=0&o=5&pid=1.7']
			}
		}
	}
</script>

<style lang="less">
	.productImg{
		width: 100%;
		height: 20rem;
		background-color: #fff;
		.lunbo{
			height: 20rem;
			width: 100%;
			.swiper-item{
				display: flex;
				justify-content: center;
				align-items: center;
				width: 100%;
				height: 20rem;
				image{
					position: absolute;
					width: 100%;
				}
			}
		}
	}
</style>